﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="util" uri="functions"%>
<!DOCTYPE html>
<html lang="en">
<head>

<!-- jsp文件头和头部 -->
<%@ include file="../index/top.jsp"%>

</head>
<body class="no-skin">

	<!-- /section:basics/navbar.layout -->
	<div class="main-container" id="main-container">
		<!-- /section:basics/sidebar -->
		<div class="main-content">
			<div class="main-content-inner">
				<div class="page-content">
					<div class="row">
						<div class="col-xs-12">
							<table style="margin-top: 8px;">
								<tr height="35">
									<c:if test="${util:addAble() }">
										<td style="width: 69px;">
											<a onclick="addRole(0)" class="btn btn-sm btn-success">新增组</a>
										</td>
									</c:if>
									<c:choose>
										<c:when test="${not empty topRoleList}">
											<c:forEach items="${topRoleList}" var="role" varStatus="vs">
												<td style="width: 100px; background-color: #cfcfcf" class="center">
													<a href="/admin/role?id=${role.id }" style="text-decoration: none; display: block;">
														<i class="menu-icon fa fa-users"></i>
														<font color="#666666">${role.roleName }</font>
													</a>
												</td>
												<td style="width: 5px;"></td>
											</c:forEach>
										</c:when>
										<c:otherwise>
											<tr>
												<td colspan="100">没有相关数据</td>
											</tr>
										</c:otherwise>
									</c:choose>
									<td></td>
								</tr>
							</table>

							<table>
								<tr height="7px;">
									<td colspan="100"></td>
								</tr>
								<tr>
									<td>
										<font color="#808080">本组：</font>
									</td>
									<td>
										<c:if test="${util:editAble() }">
											<a class="btn btn-mini btn-info" onclick="editRole('${role.id }');">
												修改组名称
												<i class="icon-arrow-right  icon-on-right"></i>
											</a>

										</c:if>
										<c:if test="${ util:deleteAble()}">
											<a class='btn btn-mini btn-danger' title="删除" onclick="delRole('${role.id }','z','${role.roleName }');">
												<i class='ace-icon fa fa-trash-o bigger-130'></i>
											</a>
										</c:if>
									</td>
								</tr>
							</table>

							<table id="simple-table" class="table table-striped table-bordered table-hover" style="margin-top: 5px;">
								<thead>
									<tr>
										<th class="center" style="width: 50px;">序号</th>
										<th class='center'>角色</th>
										<th class='center'>按钮权限</th>
										
										<th class="center">操作</th>
									</tr>
								</thead>
								<c:choose>
									<c:when test="${not empty subRoleList}">
										<c:if test="${util:listAble() }">
											<c:forEach items="${subRoleList}" var="var" varStatus="vs">

												<tr>
													<td class='center' style="width: 30px;">${vs.index+1}</td>
													<td class='center' id="ROLE_NAMETd${var.id }">${var.roleName }</td>
													<td class='center'>
														<select class="chosen-select form-control" data-role-id="${var.id }" onchange="buttonSelectChange(this)">
															<option value="-1">请选择</option>
															<c:forEach items="${buttons }" var="item">
																<option value="${item.id }">${item.name }</option>
															</c:forEach>
														</select>
													</td>
													<td class='center'>
														<c:if test="${!util:editAble() && !util:deleteAble() }">
															<div style="width: 100%;" class="center">
																<span class="label label-large label-grey arrowed-in-right arrowed-in">
																	<i class="ace-icon fa fa-lock" title="无权限"></i>
																</span>
															</div>
														</c:if>
														<c:if test="${util:editAble() }">
															<a class="btn btn-mini btn-purple" onclick="editRights('${var.id }');">
																<i class="icon-pencil"></i>
																菜单权限
															</a>
															<a class='btn btn-mini btn-info' title="编辑" onclick="editRole('${var.id }');">
																<i class='ace-icon fa fa-pencil-square-o bigger-130'></i>
															</a>
														</c:if>
														<c:if test="${util:deleteAble()}">
															<a class='btn btn-mini btn-danger' title="删除" onclick="delRole('${var.id }','c','${var.roleName }');">
																<i class='ace-icon fa fa-trash-o bigger-130'></i>
															</a>
														</c:if>
													</td>
												</tr>
											</c:forEach>
										</c:if>
										<c:if test="${!util:listAble() }">
											<tr>
												<td colspan="100" class="center">您无权查看</td>
											</tr>
										</c:if>
									</c:when>
									<c:otherwise>
										<tr>
											<td colspan="100" class="center">没有相关数据</td>
										</tr>
									</c:otherwise>
								</c:choose>
							</table>
							<div>
								<c:if test="${util:addAble() }">
								&nbsp;&nbsp;<a class="btn btn-sm btn-success" onclick="addRole('${role.id }');">新增角色</a>
								</c:if>
							</div>

						</div>
						<!-- /.col -->
					</div>
					<!-- /.row -->
				</div>
				<!-- /.page-content -->
			</div>
		</div>
		<!-- /.main-content -->


		<!-- 返回顶部 -->
		<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
			<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
		</a>

	</div>
	<!-- /.main-container -->

	<!-- basic scripts -->
	<!-- 页面底部js¨ -->
	<%@ include file="../index/foot.jsp"%>
	<!-- 删除时确认窗口 -->
	<script src="/static/ace/js/bootbox.js"></script>
	<!-- ace scripts -->
	<script src="/static/ace/js/ace/ace.js"></script>
	<!-- inline scripts related to this page -->
	<script type="text/javascript">
		$(top.hangge());
		
		//新增组
		function addRole(pid){
			 top.jzts();
			 var diag = new top.Dialog();
			 diag.Drag=true;
			 diag.Title ="新增";
			 diag.URL = '/admin/role/toAdd.do?parentId='+pid;
			 diag.Width = 222;
			 diag.Height = 150;
			 diag.CancelEvent = function(){ //关闭事件
				 if(diag.innerFrame.contentWindow.document.getElementById('zhongxin').style.display == 'none'){
					top.jzts();
					setTimeout("self.location.reload()",100);
				}
				diag.close();
			 };
			 diag.show();
		}
		
		//修改
		function editRole(ROLE_ID){
			 top.jzts();
			 var diag = new top.Dialog();
			 diag.Drag=true;
			 diag.Title ="编辑";
			 diag.URL = '/admin/role/toEdit.do?id='+ROLE_ID;
			 diag.Width = 222;
			 diag.Height = 150;
			 diag.CancelEvent = function(){ //关闭事件
				 if(diag.innerFrame.contentWindow.document.getElementById('zhongxin').style.display == 'none'){
					top.jzts();
					setTimeout("self.location.reload()",100);
					$(top.hangge());
				}
				diag.close();
			 };
			 diag.show();
		}
		
		//删除
		function delRole(roleId,msg,ROLE_NAME){
			bootbox.confirm("确定要删除["+ROLE_NAME+"]吗?", function(result) {
				if(result) {
					var postData = {};
					postData.id = roleId;
					top.jzts();
					$.post("/admin/role/delete", postData, function(result){
						if(result.code == 200){
							bootbox.alert("成功", function(){
								location.reload();
							});
							
						}else{
							bootbox.alert(result.mes);
						}
						top.hangge();
					});
				}
			});
		}
		//菜单权限
		function editRights(ROLE_ID) {
			top.jzts();
			var diag = new top.Dialog();
			diag.Drag = true;
			diag.Title = "菜单权限";
			diag.URL = '/admin/role/menuqx.do?id=' + ROLE_ID;
			diag.Width = 320;
			diag.Height = 450;
			diag.CancelEvent = function() { //关闭事件
				diag.close();
			};
			diag.show();
		}
		function buttonSelectChange(ele){
			var $this = $(ele);
			var roleId = $this.data("role-id");
			var buttonId = $this.val();
			if(buttonId == -1){
				return ;
			}
			roleButton(roleId, buttonId);
		}
		
		//按钮权限(增删改查)
		function roleButton(roleId, buttonId) {
			top.jzts();
			
			var diag = new top.Dialog();
			diag.Drag = true;
			diag.Title = "修改按钮权限";
			diag.URL = '/admin/role/button/auth/edit?roleId=' + roleId + '&buttonId=' + buttonId;
			diag.Width = 330;
			diag.Height = 450;
			diag.CancelEvent = function() { //关闭事件
				diag.close();
			};
			diag.show();
		}
	</script>


</body>
</html>